<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>Dojo-Bootstrap/Affix</title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <link rel="stylesheet" href="assets/styles.css">
        <link rel="stylesheet" href="assets/docs.css">
        <link rel="stylesheet" href="assets/responsive.css">
        
        <style>
            section {
                height: 100em;
            }
        </style>
    </head>

    <body data-spy="scroll" data-target=".bs-docs-sidebar">
        <div class="navbar navbar-inverse navbar-fixed-top">
            <div class="navbar-inner">
                <div class="container">
                    <div class="nav-collapse collapse">
                        <ul class="nav">
                            <li><a href="index.html">Tests</a></li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
            
        <header class="jumbotron subhead" id="overview">
            <div class="container">
                <h1>Dojo-Bootstrap/Affix</h1>
            </div>
        </header>
        
        <div class="container">
            <div class="row">
                <section>
                    <!-- navigation -->
                    <div class="span3 bs-docs-sidebar">
                        <ul class="nav nav-list bs-docs-sidenav" data-spy="affix" data-offset-top="270">
                            <li><a href="#a"><i class="icon-chevron-right"></i> A</a></li>
                            <li><a href="#b"><i class="icon-chevron-right"></i> B</a></li>
                            <li><a href="#c"><i class="icon-chevron-right"></i> C</a></li>
                        </ul>
                    </div>
                    
                    <!-- content -->
                    <div class="span9">
                        <section id="a">
                            <div class="page-header">
                                <h1>A</h1>
                            </div>
                        </section>
                            
                        <section id="b">
                            <div class="page-header">
                                <h1>B</h1>
                            </div>
                        </section>
                        
                        <section id="c">
                            <div class="page-header">
                                <h1>C</h1>
                            </div>
                        </section>
                    </div>
                </section>
            </div>
        </div>
        
        <script type="text/javascript" src="assets/config.js"></script>
        <script type="text/javascript" src="../vendor/dojo/dojo/dojo.js"></script>
        
        <script>
            require(["bootstrap/Affix", "bootstrap/Scrollspy"]);
        </script>
    </body>
</html>
